@extends('layout.home.master')
@section('content')
    <div class="container mt-5">
        <div class="row">
            <div class="col-12 col-xl-3">
                @include('layout.infor.menu')
            </div>

            <div class="col-12 col-xl-9">

                <div class="card">
                    <div class="card-body text-center">
                        <div class="row justify-content-center">
                            <div class="">
                                <h2>头像设置</h2>
                                <div class="card-body text-center">
                                    <form id="uploadImage" action="{{route('info.user.update',auth()->user())}}"  method="post">
                                        @csrf @method('PUT')
                                        <input type="hidden" name="icon" value="{{$user->icon}}">
                                        <div class="avatar avatar-xxl " onclick="upImagePc(this)">
                                            <input type="hidden" name="icon" value="http://laravel-cms.ishilf.com/uploads/1809/12/lC5GNOCc1P1536737303.3962.JPG">
                                            <img src="{{$user->icon}}" alt="..." class="avatar-img rounded-circle">
                                        </div>
                                    </form>

                                </div>

                            </div> <!-- / .row -->
                        </div>
                    </div>
                </div>

            </div>
        </div> <!-- / .row -->
    </div>
    <script>
        function upImagePc() {
            require(['hdjs'], function (hdjs) {
                var options = {
                    multiple: false,//是否允许多图上传
                    //data是向后台服务器提交的POST数据
                    // data: {name: '后盾人', year: 2099},
                };
                hdjs.image(function (images) {
                    //上传成功的图片，数组类型
                    $("[name='icon']").val(images[0]);
                    $(".avatar img").attr('src', images[0]);
                    $('#uploadImage').submit();
                }, options)
            });
        }
    </script>
@endsection
